<template>
  <div class="agency">

    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/institutions' }">机构列表</el-breadcrumb-item>
      <el-breadcrumb-item>机构详情</el-breadcrumb-item>
    </el-breadcrumb>

    <el-card shadow="hover">
      <div class="container">
        <div class="row">
          <div class="col col-xxl-9 col-xl-9 col-lg-12 col-md-12 col-sm-12">
            <div class="details_">
              <img :src="jumpData.img" class="details_img">
              <div class="details_list">
                <h1>{{ jumpData.name }}</h1>
                <h3>账号：{{ jumpData.account }}</h3>
                <div class="creation">
                  <div>
                    <p>联系人：{{ jumpData.linkman }}</p>
                    <p>手机号：{{ jumpData.phone }}</p>
                  </div>
                  <div>
                    <p>创建时间：{{ jumpData.createDate }}</p>
                    <p>最近登录：{{ jumpData.dengluDate }}</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="col col-xxl-3 col-xl-3 col-lg-12 col-md-12 col-sm-12">
            <div class="btn_right">
              <el-button @click="operation('reset')">重置</el-button>
              <el-button @click="operation('limit')" v-if="isLimit">限制</el-button>
              <el-button @click="operation('remove')" v-else>解除限制</el-button>
              <el-button @click="operation('goBack')" >返回</el-button>
            </div>
          </div>
        </div>
      </div>
    </el-card>

    <div class="management">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="教师管理" name="1"></el-tab-pane>
        <el-tab-pane label="学生管理" name="2"></el-tab-pane>
        <el-tab-pane label="设备管理" name="3"></el-tab-pane>
        <el-tab-pane label="数据报表" name="4"></el-tab-pane>
      </el-tabs>

      <div v-show="activeName == '1'">
        <div class="init_top">
          <div class="container">
            <div class="row">
              <div class="col col-xxl-10 col-xl-10 col-lg-9 col-md-12 col-sm-12">
                <div class="init_top-l">
                  <search-input @searchOn="searchOn" @clearChange="clearChangeOn" @changeEnter="changeEnterOn"></search-input>
                  <select-ect :optionStatus="optionStatus" @onChangeVal="onChangeVal" @clearList="clearListOn"></select-ect>
                </div>
              </div>
              <div class="col col-xxl-2 col-xl-2 col-lg-3 col-md-12 col-sm-12">
                <div class="init_top-r">
                  <el-button @click="twoBtn('firstAdd')">新增</el-button>
                  <el-button @click="twoBtn('firstLimit')">限制</el-button>
                </div>
              </div>
            </div>
          </div>
        </div>
        <t-management :formData="allData.formDataOne" @allChange="allChangeOne"></t-management>
      </div>

      <div v-show="activeName == '2'">
        <div class="init_top">
          <div class="container">
            <div class="row">
              <div class="col col-xxl-10 col-xl-10 col-lg-9 col-md-12 col-sm-12">
                <div class="init_top-l">
                  <search-input @searchOn="searchOns" @clearChange="clearChangeOns" @changeEnter="changeEnterOns"></search-input>
                  <select-ect :optionStatus="optionStatu" @onChangeVal="changeVal" @clearList="clearListOns"></select-ect>
                </div>
              </div>
              <div class="col col-xxl-2 col-xl-2 col-lg-3 col-md-12 col-sm-12">
                <div class="init_top-r">
                  <el-button @click="twoBtn('secondAdd')">添加</el-button>
                  <el-button @click="twoBtn('secondLimit')">限制</el-button>
                </div>
              </div>
            </div>
          </div>
        </div>
        <s-management :formData="allData.formDataTwo" @allChange="allChangeTwo"></s-management>
      </div>

      <div v-show="activeName == '3'">
        <div class="init_top">
          <div class="container">
            <div class="row">
              <div class="col col-xxl-10 col-xl-10 col-lg-9 col-md-12 col-sm-12">
                <div class="init_top-l">
                  <search-input @searchOn="searchOnt" @clearChange="clearChangeOnt" @changeEnter="changeEnterOnt"></search-input>
                  <select-ect :optionStatus="optionStatust" @onChangeVal="changeValth"  @clearList="clearListOnt"></select-ect>
                </div>
              </div>
              <div class="col col-xxl-2 col-xl-2 col-lg-3 col-md-12 col-sm-12">
                <div class="init_top-r">
                  <el-button @click="twoBtn('thirdAdd')">添加</el-button>
                  <el-button @click="twoBtn('thirdLimit')">限制</el-button>
                </div>
              </div>
            </div>
          </div>
        </div>
        <e-management :formData="allData.formDataThree" @allChange="allChangeThree"></e-management>
      </div>

      <div v-show="activeName == '4'">
        <div class="aroundOf">学习数据概况</div>
        <div class="fourth_one">
          <the-threes :title="allSecond.experiment" :time="allSecond.num" class="experiment"></the-threes>
          <the-threes :title="allSecond.average" :time="allSecond.sum" class="average"></the-threes>
          <the-threes :title="allSecond.teaching" :time="allSecond.kum" class="teaching"></the-threes>
          <the-threes :title="allSecond.grant" :time="allSecond.gum" class="grant"></the-threes>
          <the-threes :title="allSecond.consumables" :time="allSecond.cum" class="consumables"></the-threes>
        </div>
        <div class="boarXe">
          <line-chart :opinionData="info" :x="barX" style="height: 400px;margin: 0 auto;"></line-chart>
        </div>
        <div class="fourth_one">
          <the-second :title="allSeconds.experiment" :time="allSeconds.nums" class="experiment"></the-second>
          <the-second :title="allSeconds.average" :time="allSeconds.sums" class="average"></the-second>
          <the-second :title="allSeconds.teaching" :time="allSeconds.kums" class="teaching"></the-second>
          <the-second :title="allSeconds.grant" :time="allSeconds.gums" class="grant"></the-second>
          <the-second :title="allSeconds.consumables" :time="allSeconds.cums" class="consumables"></the-second>
        </div>
        <div class="teaching_t">
          <div>
            <div class="aroundOf">授课时长TOP5</div>
            <columnar :opinionData="infoS" :x="boxX" style="height: 400px;"></columnar>
          </div>
          <div>
            <div class="aroundOf">实验时长TOP5</div>
            <columnar :opinionData="infoY" :x="boxXe" style="height: 400px;"></columnar>
          </div>
        </div>
        <div class="aroundOf">各学科课程指标</div>
        <ul class="option_ul">
          <li :class="ind == index ? 'act' : ''" v-for="(item,index) in ulList" :key="index" @click="ulClick(index)">{{ item }}</li>
        </ul>
        <!-- <div class="disciplineYS"> -->
          <zcolumnar v-if="ind == 0"  ref="zcolumnar" :cross="discipline" :opinionData="disciplineY" style="height: 500px;margin: 0 auto;"></zcolumnar>
          <zcolumnaa v-else-if="ind == 1" :cross="disciplineA" :opinionData="disciplineAe" style="height: 500px;margin: 0 auto;"></zcolumnaa>
          <zcolumnas v-else-if="ind == 2" :cross="disciplineS" :opinionData="disciplineSes" style="height: 500px;margin: 0 auto;"></zcolumnas>
          <zcolumnae v-else-if="ind == 3" :cross="disciplineE" :opinionData="disciplineEe" style="height: 500px;margin: 0 auto;"></zcolumnae>
          <zcolumnaq v-else :cross="disciplineQ" :opinionData="disciplineQe" style="height: 500px;margin: 0 auto;"></zcolumnaq>
        <!-- </div> -->
        <div class="search_s">
          <search @searchOn="searchOne" @clearChange="clearChangeSeaOn" @changeEnter="changeEnterOneSea"></search>
          <discipline :discipline="disciplineSe" @nChange="nChange" @clearNChange="clearNChange" style="margin-left: 15px;"></discipline>
          <grade :grade="disciplineJe" @jChange="jChange" style="margin-left: 15px;"></grade>
        </div>
        <kong-from :tableDataForm="tableDataForm"></kong-from>
        <el-pagination
          background
          style="margin-top: 35px;"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage3"
          :page-size="pageSize"
          layout="prev, pager, next, jumper"
          :total="total">
        </el-pagination>
      </div>

    </div>

  </div>
</template>

<script>
import searchInput from '../../components/search/search.vue'
import selectEct from '../../components/institutions/select.vue';
import tManagement from '../../components/institutions/tManagement.vue';
import sManagement from '../../components/institutions/sManagement.vue';
import eManagement from '../../components/institutions/eManagement.vue';
import theSecond from '../../components/thieUser/theSecond.vue';
import theThrees from '../../components/thieUser/theThrees.vue';
import lineChart from '../../components/echarts/lineChart.vue';
import columnar from '../../components/echarts/columnar.vue';
import zcolumnar from '../../components/echarts/zcolumnar.vue';
import zcolumnaa from '../../components/echarts/zcolumnaa.vue';
import zcolumnas from '../../components/echarts/zcolumnas.vue';
import zcolumnae from '../../components/echarts/zcolumnae.vue';
import zcolumnaq from '../../components/echarts/zcolumnaq.vue';

import search from '../../components/search/search.vue';
import discipline from '../../components/selector/discipline.vue';
import grade from '../../components/selector/grade.vue';
import kongFrom from '../../components/institutions/kongFrom.vue';
export default {
  components: { searchInput, selectEct, tManagement, sManagement, eManagement, theSecond, theThrees, lineChart, columnar, zcolumnar, search, discipline, grade, kongFrom, zcolumnaa, zcolumnas, zcolumnae, zcolumnaq },
  data() {
    return {
      ind: 0,
      activeName: '1',
			optionStatus: [{ value: '正常', label: '正常' },{ value: '限制', label: '限制' }],
      optionStatu: [{ value: '正常', label: '正常' },{ value: '限制', label: '限制' }],
      optionStatust: [{ value: '正常', label: '正常' },{ value: '限制', label: '限制' }],
      allData: {
        formDataOne: [],
        formDataTwo: [],
        formDataThree: []
      },
      allSecond: {
        experiment: '总实验时长 （h）',
        num: 0,
        average: '平均实验时长（h）',
        sum: 0,
        teaching: '总授课时长 （h）',
        kum: 0,
        grant: '平均授课时长（h）',
        gum: 0,
        consumables: '累计节省耗材（g）',
        cum: 1
      },
      allSeconds:{
        experiment: '教师用户（人）',
        nums: 0,
        average: '学生用户（人）',
        sums: 0,
        teaching: '设备总量（个）',
        kums: 0,
        grant: '学习次数（次）',
        gums: 0,
        consumables: '实验完成度(%)',
        cums: 0
      },
      
      barX: [],
      info: [
        {
          name: 'tokyo',
          type: 'line',
          stack: 'Total',
          data: []
        },
      ],
      infoS: [],
      boxX:  [{
        data: [],
        type: 'bar',
        itemStyle: {
          normal: {
            color: function(params) {
              // 给出颜色组
              var colorList = ['skyblue', '#f0a1a8', '#c4cbcf', '#d8e3e7','#55bb8a','#83cbac','#8cc269','#fed71a','#f8b37f','#ed3333'];
              //循环调用
              return colorList[params.dataIndex%colorList.length]
            },
          }
        },
      }],
      infoY: [],
      boxXe:[{
        data: [],
        type: 'bar',
        itemStyle: {
          normal: {
            color: function(params) {
              // 给出颜色组
              var colorList = ['skyblue', '#f0a1a8', '#c4cbcf', '#d8e3e7','#55bb8a','#83cbac','#8cc269','#fed71a','#f8b37f','#ed3333'];
              //循环调用
              return colorList[params.dataIndex%colorList.length]
            },
          }
        }
      }],

      ulList:['学习人数','学习时长','人均学习时长','课程学习次数','完成率'],
      discipline: [],
      disciplineY: [{
        data: [],
        barWidth: 80,
        type: 'bar',
        itemStyle: {
          normal: {
            //这里是重点
            color: function(params) {
              //注意，如果颜色太少的话，后面颜色不会自动循环，最好多定义几个颜色
              var colorList = ['#ed5a65','#f86b1d', '#fba414', 'skyblue', '#c08eaf','#cdd1d3', '#fbda41','#f9e9cd','#ed3321'];
              return colorList[params.dataIndex]
            }
          }
        }
      }],
      disciplineA: [],
      disciplineAe: [{
        data: [],
        barWidth: 80,
        type: 'bar',
        itemStyle: {
          normal: {
            //这里是重点
            color: function(params) {
              //注意，如果颜色太少的话，后面颜色不会自动循环，最好多定义几个颜色
              var colorList = ['#ed5a65','#f86b1d', '#fba414', 'skyblue', '#c08eaf','#cdd1d3', '#fbda41','#f9e9cd','#ed3321'];
              return colorList[params.dataIndex]
            }
          }
        }
      }],
      disciplineS: [],
      disciplineSes: [{
        data: [],
        barWidth: 80,
        type: 'bar',
        itemStyle: {
          normal: {
            //这里是重点
            color: function(params) {
              //注意，如果颜色太少的话，后面颜色不会自动循环，最好多定义几个颜色
              var colorList = ['#ed5a65','#f86b1d', '#fba414', 'skyblue', '#c08eaf','#cdd1d3', '#fbda41','#f9e9cd','#ed3321'];
              return colorList[params.dataIndex]
            }
          }
        }
      }],
      disciplineE: [],
      disciplineEe: [{
        data: [],
        barWidth: 80,
        type: 'bar',
        itemStyle: {
          normal: {
            //这里是重点
            color: function(params) {
              //注意，如果颜色太少的话，后面颜色不会自动循环，最好多定义几个颜色
              var colorList = ['#ed5a65','#f86b1d', '#fba414', 'skyblue', '#c08eaf','#cdd1d3', '#fbda41','#f9e9cd','#ed3321'];
              return colorList[params.dataIndex]
            }
          }
        }
      }],
      disciplineQ: ['化学','物理','生物'],
      disciplineQe: [{
        data: [],
        barWidth: 80,
        type: 'bar',
        itemStyle: {
          normal: {
            //这里是重点
            color: function(params) {
              //注意，如果颜色太少的话，后面颜色不会自动循环，最好多定义几个颜色
              var colorList = ['#ed5a65','#f86b1d', '#fba414', 'skyblue', '#c08eaf','#cdd1d3', '#fbda41','#f9e9cd','#ed3321'];
              return colorList[params.dataIndex]
            }
          }
        }
      }],

      disciplineSe: [{ value: '物理', label: '物理' }, { value: '化学', label: '化学' }, { value: '生物', label: '生物' }],
      disciplineJe: [{ value: '初一上', label: '初一上' }, { value: '初一下', label: '初一下' }, { value: '初二上', label: '初二上' }, { value: '初二下', label: '初二下' }, { value: '初三上', label: '初三上' }, { value: '初三下', label: '初三下' }],
      tableDataForm: [],
      currentPage3: 1,
      pageSize: 0,
      total: 0,
      jumpData: {},  //跳转过来详情携带的参数
      isLimit: true,  //限制登录按钮
      time: null,  //所搜
      souSuo: '',  //数据报表搜索
      nianJi: '',  //数据报表中的年级
      xueKe: '',  // 数据报表中的学科
      xianZhi: '',   
      
      xiaLiaYiGe: '',  // 全部状态下拉
      sbGlSou: '' ,

      zhengChang: '',  // 学生管理的两个
      souSuo01: '',

      jiaoShiChange: '',  //教师管理的两个
      jiaoShiZhunang: '', 
    }
  },
  watch: {
    $route:{
      handler: function(val, oldVal){
        this.agencyDetails();  //返回页面后自动刷新
      },
      // 深度观察监听
      deep:  true
    },
  },
  updated() { 
    
  },
  mounted() {
    // console.log(this.$route.params)
    this.jumpData = JSON.parse(sessionStorage.getItem('userData'));
    this.agencyDetails();
    if(this.ind == 0) {
      this.$http.institutions.renShuZhiBiao().then( async res => {
        await res.data.filter( item => {
          if(item.subject != '') {
            this.discipline.push(item.subject);
            this.disciplineY[0].data.push(item.count);
          }
        })
      })
    }
  },
  methods: {
    agencyDetails() {
      this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id, method: 1 }).then( res => {
        this.allData.formDataOne = res.data;
      })
    },
    // 切换教师管理、学生管理、设备管理、数据报表
    handleClick(tab) {
      if(tab.index == 0) {
        this.agencyDetails();
      } else if(tab.index == '1') {
        this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id,method: this.activeName }).then( res => {
          this.allData.formDataTwo = res.data;
        })
      } else if(tab.index == '2') {
        this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id,method: this.activeName }).then( res => {
          this.allData.formDataThree = res.data;
        })
      } else if(tab.index == '3') {
        this.$http.institutions.theLoer().then( res => {
          this.tableDataForm = res.data;
          this.pageSize = res.size;
          this.total = res.total;
        })
        this.$http.institutions.theLoerGai().then( res => {
          this.allSecond.num = res.data.zong;
          this.allSecond.sum = res.data.pinshi;
          this.allSecond.kum = res.data.shoshi;
          this.allSecond.gum = res.data.pinsho;
          this.allSecond.cum = res.data.haocai || 0;
        })
        this.$http.institutions.theLoerGais().then( res => {
          this.allSeconds.nums = res.data.tcount;
          this.allSeconds.sums = res.data.xcount;
          this.allSeconds.kums = res.data.ecount;
          this.allSeconds.gums = res.data.icount;
          this.allSeconds.cums = res.data.du;
        })
        // 需要进一步修改
        this.$http.institutions.theLoerGaiZhe().then( res => {
          this.barX = [];
          this.info[0].data = [];
          res.data.filter( result => {
            this.barX.push(JSON.parse(JSON.stringify(result.shoDate)));
            this.info[0].data.push(JSON.parse(JSON.stringify(result.count)));
          })
        })
        
        this.$http.institutions.theLoerSho().then( res => {
          this.infoS = [];
          this.boxX[0].data = [];
          res.data.filter( ci => {
            this.infoS.push(ci.name);
            this.boxX[0].data.push(ci.count)
          })
        })

        this.$http.institutions.theCourware().then( res => {
          this.infoY = [];
          this.boxXe[0].data = [];
          res.data.filter( ci => {
            this.infoY.push(ci.name);
            this.boxXe[0].data.push(ci.count)
          })
        })
        this.$refs.zcolumnar.resize()

      }
    },
    // 重置/限制
    operation(val){
      if(val == 'limit') {
        this.$confirm('此操作将限制本机构下所有账号的登录, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$http.institutions.limitList({ id: JSON.parse(sessionStorage.getItem('userData')).id }).then( result => {
            if(result == undefined) {
              this.$message({
                type: 'success',
                message: '限制成功!'
              });
              this.isLimit = false;
            }
					})
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消限制'
          });
        });
      } else if(val == 'remove') {
        this.$confirm('此操作将解除限制本机构下所有账号的登录, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$http.institutions.theJieChuXianZhi({id: JSON.parse(sessionStorage.getItem('userData')).id}).then( res => {
            if(res == undefined) {
              this.$message({
                type: 'success',
                message: '解除限制成功!'
              });
              this.isLimit = true;
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消解除限制'
          });
        });
      } else if(val == 'goBack') {
        sessionStorage.removeItem('userData')
        this.$router.go(-1);
      } else {
        this.$http.institutions.theLoerChongZhi({id: JSON.parse(sessionStorage.getItem('userData')).id}).then( res => {
					if(res == undefined) {
						this.$notify({
							title: '重置机构密码，已恢复至默认',
							message: '默认密码为：000000',
							type: 'success'
						});
					}
				})
      }
    },
    // 新增/限制/添加   //目前都让跳转一个页面后期再细调整
    twoBtn(val){   //firstLimit  activeName=1  secondLimit activeName=2    thirdLimit  activeName=3
      console.log(val)   //firstAdd activeName=1  secondAdd activeName=1   thirdAdd  activeName=1  这三个需要传递参数
      if(val == 'firstAdd'){ this.$router.push({name: 'newTeacher',params: { add: 'add' }}) }
      else if(val == 'secondAdd'){ this.$router.push({name: 'newUsers',params: { belong: 0,name: JSON.parse(sessionStorage.getItem('userData')).name,add: 'newAdd' }}) }
      else if(val == 'thirdAdd') { this.$router.push({name: 'machine',params: { belong: '机构',name: JSON.parse(sessionStorage.getItem('userData')).name,add: 'macheAdd'}}) }
      else if(val == 'firstLimit') {
        const newIde = [];
        this.allData.formDataOne.filter( res => {
          newIde.push(res.id);
        })
        this.$http.institutions.UpdateSheQuan({ide: newIde.toString()}).then(res=> {
          console.log(res)
          if(res == undefined) {
            this.$message({
              type: 'success',
              message: '限制成功!'
            });
          } else {
            this.$message({
              type: 'error',
              message: '限制失败!'
            });
          }
        })
      } else if(val == 'secondLimit') {
        this.$confirm('此操作将限制对应的学生管理, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          const formDIde = [];
          this.allData.formDataTwo.filter( res => {
            formDIde.push(res.id);
          })
          this.$http.institutions.UpdateTeacheStrictAdd({ide: formDIde.toString()}).then(result=>{
            console.log(result);
          })
          this.$message({
            type: 'success',
            message: '限制成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消限制'
          });
        });
      } else if(val == 'thirdLimit') {
        this.$confirm('此操作将限制对应的设备管理, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          const newTableDate = [];
          this.allData.formDataThree.filter( res => {
            newTableDate.push(res.id);
          })
          this.$http.equipment.YoulimitList({ide: newTableDate.toString()}).then( res => {
            console.log(res)
            if(res == undefined) {
              this.$message({
                type: 'success',
                message: '限制成功!'
              });
              this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id,method: this.activeName }).then( res => {
                this.allData.formDataThree = res.data;
              })
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消限制'
          });
        });
      }
    },
    //===============================================================================
    // 教师管理
    searchOn(val){ this.jiaoShiChange = val;this.sanFunction(1,val,this.jiaoShiZhunang); },
   // 搜索框的清除
    clearChangeOn(){ this.sanFunction(1,'',this.jiaoShiZhunang); },
    // 状态清除
    clearListOn() { this.jiaoShiZhunang = '';console.log(this.jiaoShiZhunang);this.sanFunction(1,this.jiaoShiChange,''); },
    // 空格搜索
    changeEnterOn(val){ this.jiaoShiChange = val;this.sanFunction(1,val,this.jiaoShiZhunang); },
    // 下拉框搜索
		onChangeVal(val){
      if(val === '正常'){
        const newVal = val = this.jiaoShiZhunang = 1;
        this.sanFunction(1,this.jiaoShiChange,newVal);
      } else if(val === '限制'){
        const newVal = val = this.jiaoShiZhunang = 2;
        this.sanFunction(1,this.jiaoShiChange,newVal);
      } 
      // else {
      //   this.agencyDetails();
      // }
		},
    // 三个搜索公用方法
    sanFunction(num,val,xiala) {
      if (this.time) {
        clearTimeout(this.time);
      }
      this.time = setTimeout( async () => {
        await this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id,method: num,name: val,status: xiala} ).then( res => {
          this.allData.formDataOne = res.data;
        })
      }, 555);
    },
    // ---------------------------------------------
    // 学生管理下拉框搜索
    changeVal(val){
		  if(val === '正常'){
        const newVal = val = this.zhengChang = 1;
        this.sanFunctions(2, this.souSuo01, newVal);
      } else if(val === '限制'){
        const newVal = val = this.zhengChang = 2;
        this.sanFunctions(2, this.souSuo01, newVal);
      } else {
        this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id, method: 2 }).then(res => {
          this.allData.formDataTwo = res.data;
        })
      }
    },
    // 搜索按钮查询
    searchOns(val){ this.souSuo01 = val;this.sanFunctions(2, val, this.zhengChang || ''); },
    // 这个是学生管理中的回车搜索
    changeEnterOns(val){ this.souSuo01 = val;this.sanFunctions(2, val, this.zhengChang || ''); },
    // 这个是学生管理中的搜索清除
    clearChangeOns(){ this.sanFunctions(2, '', this.zhengChang || ''); },
    // 状态清除按钮
    clearListOns(){ this.sanFunctions(2, this.souSuo01, ''); },
    // 三个搜索公用方法
    sanFunctions(num,val,xiala) {
      if (this.time) {
        clearTimeout(this.time);
      }
      this.time = setTimeout( async () => {
        await this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id,method: num,name: val,status: xiala} ).then( res => {
          this.allData.formDataTwo = res.data;
        })
      }, 1000);
    },
    
    // -------------------------------------------------------------
    // 设备管理搜索
    searchOnt(val){
      this.sbGlSou = val;
			this.sanFunctiona(3, val);
    },
    // 这个是设备管理中的搜索清除事件
    clearChangeOnt(){this.sanFunctiona(3, '', this.xiaLiaYiGe);},
    // 这个是设备管理中的回车搜索事件
    changeEnterOnt(val){ this.sbGlSou = val;this.sanFunctiona(3, val, this.xianZhi); },
    changeValth(val){
      this.xianZhi = val;
      if(val === '正常'){
        const newVal = val = this.xiaLiaYiGe = 1;
        this.sanFunctiona(3, '', newVal);
      } else if(val === '限制'){
        const newVal = val = this.xiaLiaYiGe = 2;
        this.sanFunctiona(3, '', newVal);
      } 
      // else {
      //   this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id, method: 3 }).then(res=>{
      //     this.allData.formDataThree = res.data;
      //   })
      // }
    },
    // 清除
    clearListOnt(){this.sanFunctiona(3, this.sbGlSou, '');},
    // 三个搜索公用方法
    sanFunctiona(num,val,xiala) {
      if (this.time) {
        clearTimeout(this.time);
      }
      this.time = setTimeout( async () => {
        await this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id,method: num,name: val,status: xiala}).then( res => {
          this.allData.formDataThree = res.data;
        })
      }, 555);
    },

    // -----------------------------------------------

    // 组件操作点击
    allChangeOne(index, row, val){
      // console.log(index, row, val)
      if(val == 'details') {
        this.$router.push({name: 'newTeacher' , params: row })
      } else if(val == 'limit') {
        this.$http.theUser.theJiePdateShe({id: row.id}).then( res => {
          if(res == undefined) {
            this.$message({
              type: 'success',
              message: '限制成功!'
            });
            this.agencyDetails();
          } else {
            this.$message({
              type: 'success',
              message: '限制失败!'
            });
          }
        })
      }
    },
    // 学生管理中的操作
    allChangeTwo(index, row, val){
      // console.log(row)
      if(val == 'details') {
        this.$router.push({name: 'userDetails' , params: {row, add: 'userAdd'}})
      } else if(val == 'limit') {
        this.$confirm('此操作将限制限制当前学生登录, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$http.theUser.limitList({id: row.id}).then( res => {
            if(res == undefined) {
              this.$message({
                type: 'success',
                message: '限制成功!'
              });
              this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id,method: this.activeName }).then( res => {
                this.allData.formDataTwo = res.data;
              })
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消限制'
          });
        });
      }
    },
    allChangeThree(index, row, val){
      // console.log(index, row, val)
      if(val == 'details') {
        this.$router.push({name: 'eqDetails' , params: {row,add: 'detaAdd'}})
      } else if(val == 'limit') {
        console.log('限制此账号3')
        this.$confirm('此操作将限制限制当前设备登录, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$http.institutions.UpdateXianzhi({id: row.id}).then( result => {
            console.log(result);
            this.$message({
              type: 'success',
              message: '限制成功!'
            });
            this.$http.institutions.agencyDetails({id: JSON.parse(sessionStorage.getItem('userData')).id,method: this.activeName }).then( res => {
              this.allData.formDataThree = res.data;
            })
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消限制'
          });
        });
      }
    },
    // ------------------------------------------------------------------

    // 数据报表 各学科课程指标
    ulClick(index){
      var _this = this;
      _this.ind = index;
      if(index == 0) {
        _this.discipline = [];
        _this.disciplineY[0].data = []
        _this.$http.institutions.renShuZhiBiao().then(res => {
          res.data.filter( item => {
            if(item.subject != '') {
              _this.discipline.push(item.subject);
              _this.disciplineY[0].data.push(item.count);
            }
          })
        })
      } else if(index == 1) {
        _this.disciplineA = [];
        _this.disciplineAe[0].data = [];
        _this.$http.institutions.CourwareTongShi().then(res => {
          res.data.filter( item => {
            if(item.subject != '') {
              _this.disciplineA.push(item.subject);
              _this.disciplineAe[0].data.push(item.count);
            }
          })
        })
      } else if(index == 2) {
        _this.disciplineS = [];
        _this.disciplineSe[0].data = [];
        _this.$http.institutions.CourwareTongPin().then(res => {
          res.data.filter( item => {
            if(item.subject != '') {
              _this.disciplineS.push(item.subject);
              _this.disciplineSes[0].data.push(item.count);
            }
          })
        })
      } else if(index == 3) {
        _this.disciplineE = [];
        _this.disciplineEe[0].data = [];
        _this.$http.institutions.CourwareTongCi().then(res => {
          res.data.filter( item => {
            if(item.subject != '') {
              _this.disciplineE.push(item.subject);
              _this.disciplineEe[0].data.push(item.count);
            }
          })
        })
      } else {   
        _this.disciplineQ = [];
        _this.disciplineQe[0].data = [];
        _this.$http.institutions.CourwareTongDu().then(res => {
          res.data.filter( item => {
            if(item.subject != '') {
              _this.disciplineQ.push(item.subject);
              _this.disciplineQe[0].data.push(item.count);
            }
          })
        })
      }
    },
    // 搜索
    searchOne(val){  this.souSuo = val;this.sanFunctionSou(this.currentPage3,val,this.xueKe,this.nianJi.toString());  },
    // 搜索的清除
    clearChangeSeaOn(){  this.sanFunctionSou(this.currentPage3,'',this.xueKe,this.nianJi.toString()); },
    // 搜索的回车案件
    changeEnterOneSea(val){ this.souSuo = val;this.sanFunctionSou(this.currentPage3,val,this.xueKe,this.nianJi.toString()) },
    // 报表学科
    nChange(val){
      this.xueKe = val;
      if(val === '物理'){
        this.currentPage3 = 1;
        this.sanFunctionSou(this.currentPage3,this.souSuo,val,this.nianJi.toString())
      } else if(val === '化学'){
        this.currentPage3 = 1;
        this.sanFunctionSou(this.currentPage3,this.souSuo,val,this.nianJi.toString())
      } else if(val == '生物') {
        this.currentPage3 = 1;
        this.sanFunctionSou(this.currentPage3,this.souSuo,val,this.nianJi.toString())
      }
    },
    // 报表学科清除按钮
    clearNChange(){
      this.currentPage3 = 1;
      this.sanFunctionSou(this.currentPage3,this.souSuo,'',this.nianJi.toString())
    },
    // 报表年级
    jChange(val){
      this.nianJi = val;
      this.currentPage3 = 1;
      this.sanFunctionSou(this.currentPage3,this.souSuo,this.xueKe,val.toString());
    },
    // 分页
    handleSizeChange(val) {
      this.currentPage3 = val;
    },
    handleCurrentChange(val) {
      this.currentPage3 = val;
      this.sanFunctionSou(val,this.souSuo,this.xueKe,this.nianJi.toString())
    },
    
    // 三个搜索公用方法
    sanFunctionSou(valPage,val,subject,clas) {
      if (this.time) {
        clearTimeout(this.time);
      }
      this.time = setTimeout( async () => {
        await this.$http.institutions.theLoer({page: valPage,name: val,subject: subject,clas: clas} ).then( res => {
          this.tableDataForm = res.data;
          this.total = res.total;
          this.currentPage3 = res.currentPage;
        })
      }, 555);
    },
  }
}
</script>

<style scoped>
@import '../../assets/css/institutions/agency.scss';
</style>
